<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>会员注册</title>
    <!--<link rel="stylesheet" href="css/bootstrap.css"/>-->
    <!--<link rel="stylesheet" href="../www/css/ionic.css"/>-->

    <!--<script src="js/bootstrap.js"></script>-->
    <style>
        *{
            box-sizing:border-box;
        }
        html,body{
            margin:0;
            padding:0;
        }
        a{
            text-decoration:none;
            color:black;
        }
        a:hover{
            text-decoration: underline;
        }
        .header{
            width:980px;
            margin:0 auto;
        }
        .main .main-head{
            width:980px;
            height:28px;
            margin:0 auto;
            border-bottom:1px solid #ccc;
        }
        .main .main-head div{
            width:160px;
            height:28px;
            line-height:28px;
            text-align:center;
            background-color:#ccc;
            border-top-left-radius:5px;
            border-top-right-radius:5px;
        }
        .main .reg{
            width:980px;
            height:420px;
            margin:10px auto;
            border:1px solid #ccc;
            position:relative;
        }
        .main .reg .reg-l{
            width:758px;
            height:420px;
            padding:20px 0 30px 15px;
        }
        .main .reg .reg-l .reg_title{
            width:743px;
            height:30px;
            line-height:30px;
            border-bottom:1px solid #ccc;
        }
        .main .reg .reg-l .reg_form{
            width:700px;
            height:66px;
            margin:10px auto;
        }
        .main .reg .reg-l .reg_form .content{
            width:580px;
            height:66px;
            float:left;
        }
        .main .reg .reg-l .reg_form .tips{
            display:inline-block;
            width:300px;
            font-size:12px;
        }
        .main .reg .reg-l label{
            width:100px;
            height:30px;
            line-height:30px;
            text-align:right;
            float:left;
        }
        .main .reg .reg-l input{
            width:240px;
            height:30px;
            font-size:16px;
            border:1px solid #ABABAB;
        }
        .main .reg .reg-l .reg_sub{
            margin-left:120px;
        }
        .main .reg .reg-r{
            width:210px;
            position:absolute;
            right:10px;
            top:0;
        }
        .footer{
            text-align:center;
        }
    </style>
</head>
<body>
<div class="wrapper">
    <div class="header">
        <div>
            <a href="/">
                <img src="https://passport.banggo.com/CASServer/themes/banggo/images/banggo/logo.jpg">
            </a>
        </div>
    </div>
    <div class="main">
        <div class="main-head">
            <div>
                <a href="javascript:">用户注册</a>
            </div>
        </div>
        <form method="POST" action="" class="reg">
            <div class="reg-l">
                <div class="reg_title"><pre>  填写账户信息（以下内容均为必填）</pre></div>
                <!--用户名-->
                <div class="reg_form">
                    <label>用户名：</label>
                    <div class="content">
                        <input type="text" name="petname" placeholder="请填写用户名" pattern="\w|[^x00-xff]|@)?){6,20}" required>
                        <span class="tips">4-20个字符，一个汉字为两个字符，推荐使用中文会会员名字。一旦注册成功会员名将不能修改。</span>
                        <span></span>
                    </div>
                </div>
                <!--密码-->
                <div  class="reg_form">
                    <label>密码：</label>
                    <div class="content">
                        <input type="password" class="form-control" name="password" placeholder="请填写密码" pattern="^.{6,12}$" required>
                        <span class="tips">6-16个字符，请使用字符加数字的组合密码。</span>
                        <span></span>
                    </div>
                </div>
                <!--确认密码-->
                <div  class="reg_form">
                    <label>确认密码：</label>
                    <div class="content">
                        <input type="password" class="form-control" name="rpassword" placeholder="请再次输入密码" pattern="^.{6,12}$" required>
                        <span class="tips">请再次输入登录密码。</span>
                        <span></span>
                    </div>
                </div>
                <!--电子邮箱-->
                <div  class="reg_form">
                    <label>邮箱：</label>
                    <div class="content">
                        <input type="email" class="form-control" name="email" placeholder="请输入电子邮箱地址" required>
                        <span class="tips">请输入您的邮箱。</span>
                        <span></span>
                    </div>
                </div>
                <button type="submit" class="reg_sub">注册</button>
            </div>
            <div style="clear:both"></div>
            <div class="reg-r">
                <p><img src="https://passport.banggo.com/CASServer/themes/banggo/images/banggo/bgowelcometext.png"></p>
            </div>
        </form>
    </div>
    <div class="footer">
        <span>美特斯邦威集团网站：</span>
        <a href="http://www.metersbonwe.com/">美特斯邦威</a> |
        <a href="http://www.me-city.com/">ME&CITY</a> |
        <a href="http://www.chincn.com/">CH'IN祺</a> |
        <a href="http://www.banggo.com">邦购网</a>
    </div>
</div>
</body>
</html>
<script src="js/jquery.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="script/index1.js"></script>
<script src="script/reg.js"></script>